<template>
	<!-- 陆亿版本 -->
	<view>
		<!-- 头部搜索框 -->
		<view class="topSearch">
			<zy-forms :model="model" :rules="rules" ref="ruleForm">
				<zy-form-item :label="$t('homepage.WarehouseManage.barCodeTitle')+$t('public.colon')" labelWidth="85"
					required>
					<zy-input v-model="model.barcode" @confirm="barCodeConfirm" sufSlot>
						<i class="iconfont icon-saoyisao" @click="scanHandle('barcode')" v-if="!model.barcode"></i>
						<i class="iconfont icon-qingchu" @click="model.barcode='',model.batchNo=''" v-else></i>
					</zy-input>
				</zy-form-item>
				<zy-form-item :label="$t('homepage.ProductionMonitor.volumeNoTitle')" labelWidth="85" :border="false">
					<zy-input v-model="model.batchNo" @confirm="batchNoConfirm" sufSlot>
						<i class="iconfont icon-saoyisao" @click="scanHandle('batchNo')" v-if="!model.batchNo"></i>
						<i class="iconfont icon-qingchu" @click="model.batchNo=''" v-else></i>
					</zy-input>
				</zy-form-item>
			</zy-forms>
		</view>
		<!-- 分段器 -->
		<zy-segmented :values="items" :current="current" styleType="button" @onClickItem="onClickItem" :fixed="false">
			<!-- 搜索无记录 -->
			<zy-empty v-if="current==0?dataList.length==0:list.length==0"></zy-empty>
			<!-- 明细列表 -->
			<zy-group v-for="(item,index) in current==0?dataList:list" :key="item.id" model="insideCard" title=""
				:btnList="current==1?btnList:[]" @btnHandle="current==1?delBtn(item, index):''" v-else>
				<zy-forms :model="item" border labelWidth="160">
					<zy-form-item :label="$t('homepage.ProductionMonitor.lightNoTitle')"><text
							class="formText">{{item.sgh || $t('public.null')}}</text>
					</zy-form-item>
					<zy-form-item :label="$t('homepage.ProductionMonitor.volumeNoTitle')"><text
							class="formText">{{item.barcode || $t('public.null')}}</text>
					</zy-form-item>
					<zy-form-item :label="$t('homepage.ProductionMonitor.materialCodeTitle')"><text
							class="formText">{{item.materialCode || $t('public.null')}}</text>
					</zy-form-item>
					<zy-form-item :label="$t('public.name') + $t('public.colon') "><text
							class="formText">{{item.materialName|| $t('public.null')}}</text>
					</zy-form-item>
					<zy-form-item :label="$t('public.materialSpec') + $t('public.colon')"><text
							class="formText">{{item.materialSpec || $t('public.null')}}</text>
					</zy-form-item>
					<zy-form-item :label="$t('homepage.ProductionMonitor.colorTitle')"><text
							class="formText">{{item.color || $t('public.null')}}</text>
					</zy-form-item>
					<zy-form-item :label="$t('homepage.WarehouseManage.productDoorWidth')"><text
							class="formText">{{item.mengfucM || $t('public.null')}}</text>
					</zy-form-item>
					<zy-form-item :label="$t('homepage.WarehouseManage.productGramWeight')"><text
							class="formText">{{item.cpkz || $t('public.null')}}</text>
					</zy-form-item>
					<zy-form-item :label="$t('homepage.ProductionMonitor.numTitle')"><text
							class="formText">{{item.num || $t('public.null')}}</text>
					</zy-form-item>
					<zy-form-item :label="$t('homepage.WarehouseManage.clothDoorWidth') + $t('public.colon')"><text
							class="formText">{{item.hxmf || $t('public.null')}}</text>
					</zy-form-item>
					<zy-form-item :label="$t('homepage.WarehouseManage.clothGramWeight') + $t('public.colon')"><text
							class="formText">{{item.pibukezhong || $t('public.null')}}</text>
					</zy-form-item>
					<zy-form-item :label="$t('homepage.WarehouseManage.flowerPatternName') + $t('public.colon')"><text
							class="formText">{{item.hxmc || $t('public.null')}}</text>
					</zy-form-item>
					<zy-form-item :label="$t('homepage.WarehouseManage.colorCode') + $t('public.colon')"><text
							class="formText">{{item.hxbm || $t('public.null')}}</text>
					</zy-form-item>
					<zy-form-item :label="$t('public.position') + $t('public.colon')"><text
							class="formText">{{item.warehousePositionCode || $t('public.null')}}</text>
					</zy-form-item>
					<zy-form-item :label="$t('public.storage') + $t('public.colon')"><text
							class="formText">{{item.warehouseStorageCode || $t('public.null')}}</text>
					</zy-form-item>
				</zy-forms>
			</zy-group>
			<!-- 底部按钮 -->
			<bottomBtn fixed :leftText="$t('public.reset')" :rightText="rightText" :leftDisabled="leftDisabled"
				:rightDisabled="rightDisabled" @rightBtn="rightBtn" @leftBtn="resetBtn">
				<view class="btn-total">
					<span v-if="current==0"><text
							style="color: #999;font-size: 32rpx;">{{$t('homepage.WarehouseManage.outStorageTotal')}}</text>{{outStorageTotal}}</span>
					<span v-else><text
							style="color: #999;font-size: 32rpx;">{{$t('homepage.WarehouseManage.metersTotal')}}</text>{{metersTotal}}</span>
				</view>
			</bottomBtn>
		</zy-segmented>
		<!-- 提交二次确认 -->
		<zy-popup ref="confirmPopup" :title="$t('homepage.WarehouseManage.submitSure')" type="dialog"
			@confirm="submitConfirm">
			{{$t('homepage.WarehouseManage.submitInfo')}}
		</zy-popup>
	</view>
</template>
<script>
	import {
		getApplyDetail,
		selectBatchNo,
		isBatchNo,
		getStorehouseInByCode,
		saveStorehouseOut
	} from "@/api/homepage.js"
	import scanData from '@/common/scan.js';
	import audio from '@/common/audio.js' // 语音播报
	export default {
		components: {},
		data() {
			return {
				//表单value
				model: {
					barcode: '',
					batchNo: '',
				},
				nextScan: false,
				//表单校验
				rules: [{
					required: true,
					name: "barcode",
					checkType: "notnull",
					checkRule: "",
					message: this.$t('homepage.WarehouseManage.inputBarCode')
				}],
				items: [this.$t('homepage.WarehouseManage.detailedList'), this.$t(
					'homepage.WarehouseManage.outStorageList')], //分段器名称
				current: 0, //分段器默认初始值
				// 待入库清单表单按钮
				btnList: [{
					text: this.$t('public.del'),
					type: 'danger'
				}],
				dataList: [],
				list: [], // 待入库清单表单数据
				rightText: this.$t('homepage.WarehouseManage.submit'), //底部右侧按钮名称
				leftDisabled: true, //底部左侧按钮禁用
				rightDisabled: true, //底部右侧按钮禁用,current==0
				submitDisabled: true, //底部右侧按钮禁用,current==1
				selectList: [], //已选择待入库清单
				outStorageTotal: 0, //出库总数
				metersTotal: 0, //米数总和
			}
		},
		onLoad() {
			//PDA扫描主页指示单号
			var _this = this
			uni.$on('scancodedate', function(data) {
				if (!_this.nextScan) {
					_this.model.barcode = data.code
					_this.barCodeSearchList(data.code)
				} else {
					_this.model.batchNo = data.code
					_this.batchNoSearchList(data.code)
				}
			})
		},
		onUnload() {
			// 移除监听事件      
			uni.$off('scancodedate')
		},
		computed: {
			isBtnShow() {
				return {
					current: this.current,
					list: this.list,
					dataList: this.dataList,
					model: this.model
				}
			}
		},
		watch: {
			isBtnShow: {
				handler(n, o) {
					if (n.dataList.length > 0 || n.model.batchNo) {
						this.leftDisabled = false
					} else {
						this.leftDisabled = true
					}
					if (n.current == 1 && n.list.length > 0) {
						this.rightDisabled = false
					} else {
						this.rightDisabled = true
					}
				},
				immediate: true,
				deep: true
			},
		},
		methods: {
			// “内部单号”/“卷条码”二维码扫码事件
			scanHandle(field) {
				scanData.getScanData()
				uni.$once("barScan", (rel) => {
					if (field == "barcode") {
						this.model.barcode = rel
						this.barCodeSearchList(rel)
					} else if (field == "batchNo") {
						if (!this.model.barcode) {
							uni.showToast({
								title: this.$t('homepage.WarehouseManage.inputBarCodeSearch'),
								icon: "none",
								duration: 3000
							})
						} else {
							this.model.batchNo = rel
							this.batchNoSearchList(rel)
						}
					}
				})
			},
			// 搜索框回车事件
			barCodeConfirm(e) {
				this.model.barcode = e
				this.barCodeSearchList(e)
			},
			batchNoConfirm(e) {
				this.model.batchNo = e
				this.batchNoSearchList(e)
			},
			// 查询事件
			// 条码
			barCodeSearchList(e) {
				this.dataList = []
				getApplyDetail({
					barcode: e,
				}).then((res) => {
					if (res.code == 0) {
						this.dataList = res.data
						this.nextScan = true
						this.outStorageTotal = res.data[0].applySum
					} else {
						uni.showToast({
							title: res.message,
							icon: "none",
							duration: 3000
						})
					}
				}).catch((res) => {
					uni.showToast({
						title: res.message,
						icon: "none",
						duration: 3000
					})
				})
			},
			// 卷号/内部单号查询
			getBatchNo(e) {
				selectBatchNo({
					barcode: this.model.barcode,
					batchNo: e.batchNo,
				}).then((res) => {
					if (res.code == 0) {
						// 卷号
						if (e.type == 0) {
							// 规格，色光号，颜色，花型名称，花型颜色编码，发货仓库名称
							if (this.dataList.findIndex(m => m.materialSpec === res.data[0].materialSpec) !== -1 &&
								this.dataList.findIndex(m => m.color === res.data[0].color) !== -1 &&
								this.dataList.findIndex(m => m.hxmc === res.data[0].hxmc) !== -1 &&
								this.dataList.findIndex(m => m.hxbm === res.data[0].hxbm) !== -1 &&
								this.dataList.findIndex(m => m.warehouseName === res.data[0].warehouseName) !== -1
							) {
								if (this.list.findIndex(m => m.barcode === e.batchNo) !== -1) {
									uni.showToast({
										title: this.$t('public.searchRepeat'),
										icon: "none",
										duration: 3000
									})
									audio.getInnerAudio('../../../../../static/repeat.wav')
								} else {
									this.list = this.list.concat(res.data[0])
									audio.getInnerAudio('../../../../../static/scanSuccess.wav')
									this.metersTotal = this.list.reduce((prev, curr) => {
										return prev + curr.num
									}, 0)
								}
							} else {
								uni.showToast({
									title: this.$t('homepage.ProductionMonitor.inforMismatch'),
									icon: "none",
									duration: 3000
								})
								audio.getInnerAudio('../../../../../static/scanFail.wav')
							}
						} 
						// 内部单号
						else {
							if (this.list.findIndex(m => m.nbdocnum === e.batchNo) !== -1) {
								uni.showToast({
									title: this.$t('public.searchRepeat'),
									icon: "none",
									duration: 3000
								})
								audio.getInnerAudio('../../../../../static/repeat.wav')
							} else {
								this.list = this.list.concat(res.data)
								audio.getInnerAudio('../../../../../static/scanSuccess.wav')
								this.metersTotal = this.list.reduce((prev, curr) => {
									return prev + curr.num
								}, 0)
							}
						}
					} else {
						uni.showToast({
							title: res.message,
							icon: "none",
							duration: 3000
						})
						audio.getInnerAudio('../../../../../static/scanFail.wav')
					}
				}).catch((res) => {
					audio.getInnerAudio('../../../../../static/scanFail.wav')
					uni.showToast({
						title: res.message,
						icon: "none",
						duration: 3000
					})
				})
			},
			// 卷号/内部单号判断
			batchNoSearchList(e) {
				isBatchNo({
					batchNo: e,
				}).then((res) => {
					if (res.code == 0) {
						this.getBatchNo({
							type: res.data,
							batchNo: e
						})
					} else {
						audio.getInnerAudio('../../../../../static/scanFail.wav')
						uni.showToast({
							title: res.message,
							icon: "none",
							duration: 3000
						})
					}
				}).catch((res) => {
					audio.getInnerAudio('../../../../../static/scanFail.wav')
					uni.showToast({
						title: res.message,
						icon: "none",
						duration: 3000
					})
				})
			},
			// 分段器选项发生改变时触发
			onClickItem(e) {
				this.current = e
			},
			// 重置事件
			resetBtn() {
				uni.redirectTo({
					url: "/pages/HomePage/WarehouseManage/StorageManagement/Outstorage/index"
				})
			},
			// 底部右侧按钮事件
			rightBtn(item) {
				this.$refs.confirmPopup.open()
			},
			// 删除事件
			delBtn(item) {
				this.list.forEach((p, q) => {
					if (item === p) {
						this.list.splice(q, 1);
					}
				})
			},
			// 提交二次确认弹窗确认事件
			submitConfirm() {
				this.$refs.confirmPopup.close()
				saveStorehouseOut({
					dataArray: JSON.stringify(this.list),
					productionNo: this.dataList[0].productionNo
				}).then((res) => {
					uni.showToast({
						title: res.message,
						icon: "none",
						duration: 3000
					})
					if (res.code == 0) {
						setTimeout(() => {
							this.resetBtn()
						}, 1000)
					}
				}).catch((res) => {
					uni.showToast({
						title: res.message,
						icon: "none",
						duration: 3000
					})
				});
			},
		}
	}
</script>
<style lang="scss" scoped>
	.topSearch {
		background: #ffffff;
		padding: 0 30rpx;
		width: calc(100% - 60rpx);
	}

	.bottomBtn {
		background: #ffffff;
	}

	.btn-total {
		width: 600rpx;
		padding: 17rpx 10rpx;
		margin: auto 10rpx auto 10rpx;
		background-color: #ffffff;
		border-radius: 10rpx 0 0 10rpx;
	}
</style>